﻿<!DOCTYPE html>
<html>
<head>
  <!-- Standard Meta -->
  <meta charset="utf-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">

  <!-- Site Properities -->
  <title>Feed Example - Semantic</title>

  <link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700|Open+Sans:300italic,400,300,700' rel='stylesheet' type='text/css'>
  <link rel="stylesheet" type="text/css" href="../packaged/css/semantic.css">

  <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.3/jquery.js"></script>
  <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery.address/1.6/jquery.address.js"></script>
  <script src="../packaged/javascript/semantic.js"></script>

  <link rel="stylesheet" type="text/css" href="feed.css">
  <script src="feed.js"></script>
</head>
<div class="ui segment">
  <h3 class="ui right floated header">
    <div class="ui icon input">
      <input placeholder="Search..." type="text">
      <i class="circular search icon"></i>
    </div>
  </h3>

  <h3 class="ui left floated header">
    <div class="label">
      <img src="  images/user.png"/>
      nombreDeUsuario@email.com
    </div>
    
  </h3>
  
</div>
<body id="feed">  
  <div class="ui celled grid">
	
    <div class="three wide middle column">      
      <h2 class="ui header">
        <i class="inbox icon"></i>
        Inbox
      </h2>
      
      <div class="ui divided inbox selection list active tab" data-tab="unread">
        <a class="active item">
          <div class="left floated ui star rating"><i class="icon"></i></div>
          <div class="right floated date">Todo</div>
          
        </a>
        <a class="item">
          <div class="left floated ui star rating"><i class="reorder icon"></i></div>
          <div class="right floated date">Completado</div>
          
        </a>
        <a class="item">
          <div class="left floated ui star rating"><i class="icon"></i></div>
          <div class="right floated date">Operativos</div>
          
        </a>
        <a class="item">
          <div class="left floated ui star rating"><i class="icon"></i></div>         
		  <div class="right floated date">Arq. informacion</div>
		</a>
        <a class="item">
          <div class="left floated ui star rating"><i class="icon"></i></div>
          <div class="right floated date">Aplic. Web</div>
          
        </a>
        <a class="item">
          <div class="left floated ui star rating"><i class="icon"></i></div>
          <div class="right floated date">Interfaces</div>         
        </a>
      </div>     
    </div>
    <div class="nine wide right column">
      
		<div class="ui fluid icon input">
        <input placeholder="A&ntilde;adir un elemento a &quot;Bandeja de entrada&quot; " type="text">          
      </div>
		<div class="ui basic segment">
		  <div class="ui label">
           Operativos
        </div>
		</div>		
		<div class="fluid ui button">
      <div class="ui checkbox">
            <input id="check1" type="checkbox">
            <label for="check1">Primer examen parcial</label>
          </div>
    </div>
		<div class="ui basic segment">
      <div class="ui label">
           Arq. Informaci&oacute;n
        </div>
    </div>  	
		<div class="fluid ui button">
      <div class="ui checkbox">
            <input id="check1" type="checkbox">
            <label for="check1">Primer examen parcial</label>
          </div>
    </div>
		<div class="ui basic segment">
      <div class="ui label">
           Interfaces
        </div>
    </div>    
    <div class="fluid ui button">
      <div class="ui checkbox">
            <input id="check1" type="checkbox">
            <label for="check1">Preparar Cap.4 - Distribucion</label>
      </div>
    </div>
    <div class="fluid ui button">
    <div class="ui checkbox">
            <input id="check1" type="checkbox">
            <label for="check1">Preparar enunciado de proyecto 1</label>
      </div>
    </div>
			
    </div>
	<div class="three wide middle column">     
      
      <div class="ui divided inbox selection list active tab" data-tab="unread">
        
        <a class="item">
          <div class="ui icon input">
			  <input type="text" placeholder="1er examen parcial">
			  <i class="star"></i>
			</div>
        </a>
        <a class="item">
          <div class="left floated ui star rating">
            <i class="icon"></i></div>
          <div class="right floated date">Configurar una fecha limite</div>
          
        </a>
        <a class="item">
          <div class="left floated ui star rating"><i class="icon"></i></div>
          <div class="right floated date">Recordar</div>
          
        </a>
        
      </div>
      <div class="ui vertical labeled icon buttons">
        <div class="ui button">
          <i class="plus icon"></i>
          A&ntildeadir una subtarea
        </div>
        <br>
      </div>
      <div>
      <form class="ui reply form">
        <div class="field">
          <textarea></textarea>
        </div>        
      </form>
      </div>     
      <div class="ui vertical labeled icon buttons">
        <div class="ui button">
          A&ntildeadir un archivo
        </div>
        <br>
      </div>
    </div>
  </div>
  
</body>

</html>